// 表单查看
<template>
  <div class="form-container card">
    <el-form
      class="form"
      ref="operaForm"
      :model="operaForm"
      label-width="150px"
    >
      <!-- 如果不是送电曲线表单 -->
      <template v-if="kind !== 'giveElectric' && kind !== 'minuteInfo'">
        <el-form-item
          v-for="item in operaForm"
          :key="item.id"
          :prop="item.prop"
          :label="item.label"
        >
          <!-- 渲染常规表单数据 不是送电曲线 也不是时间选择器 只是普通的表单 -->
          <el-input
            v-if="item.prop !== 'stipulate_time'"
            v-model="operaInfo[item.prop]"
            :placeholder="item.placeholder"
          />
          <!-- 时间选择器 -->
          <el-time-select
            v-if="item.prop === 'stipulate_time'"
            v-model="operaInfo[item.prop]"
            :picker-options="{
              start: '00:00',
              step: '00:15',
              end: '23:45',
            }"
            :placeholder="item.placeholder"
          >
          </el-time-select>
        </el-form-item>
      </template>
      <!-- 如果是送电记录表详细信息表单 -->
      <template v-else-if="kind === 'minuteInfo'">
        <el-form-item
          v-for="item in operaForm"
          :key="item.id"
          :prop="item.prop"
          :label="item.label"
        >
          <!-- 渲染常规表单数据 不是送电曲线 也不是时间选择器 只是普通的表单 -->
          <el-input
            v-if="
              item.prop !== 'stipulate_time' &&
              item.prop.indexOf('voltage') === -1 &&
              item.prop.indexOf('current') === -1
            "
            v-model="operaInfo[item.prop]"
            :placeholder="item.placeholder"
          />
          <!-- 时间选择器 -->
          <el-time-select
            v-if="item.prop === 'stipulate_time'"
            v-model="operaInfo[item.prop]"
            :picker-options="{
              start: '00:00',
              step: '00:15',
              end: '23:45',
            }"
            :placeholder="item.placeholder"
          >
          </el-time-select>
          <el-input
            v-if="item.prop === 'first_voltage'"
            v-model="operaInfo.first_voltage[item.what]"
            :placeholder="item.placeholder"
          />
          <el-input
            v-if="item.prop === 'first_current'"
            v-model="operaInfo.first_current[item.what]"
            :placeholder="item.placeholder"
          />
          <el-input
            v-if="item.prop === 'second_voltage'"
            v-model="operaInfo.second_voltage[item.what]"
            :placeholder="item.placeholder"
          />
          <el-input
            v-if="item.prop === 'second_current'"
            v-model="operaInfo.second_current[item.what]"
            :placeholder="item.placeholder"
          />
        </el-form-item>
      </template>

      <!-- 如果是送电曲线表单 -->
      <!-- 如果不是创建操作 只是查看 -->
      <template v-else-if="kind === 'giveElectric' && handle === '查看'">
        <!-- 由于查看按钮可以看其它基本信息 所以这里筛选出来送电时间和电量 只展示24小时的送电曲线信息 -->
        <el-form-item
          v-if="item.prop.indexOf('target') !== -1"
          v-for="item in operaForm"
          :key="item.id"
          :prop="item.prop"
          :label="item.label"
        >
          <!-- 渲染送电时间表单数据 -->
          <el-input
            v-if="item.prop.indexOf('target') !== -1 && operaInfo.target !== undefined"
            v-model="operaInfo.target[item.what][item.prop]"
            :placeholder="item.placeholder"
          />
        </el-form-item>
      </template>
      <!-- 如果是编辑 -->
      <template v-else-if="handle === '编辑' || handle === '创建'">
        <el-form-item
          v-for="item in operaForm"
          :key="item.id"
          :prop="item.prop"
          :label="item.label"
        >
          <el-input
            v-if="item.prop.indexOf('target') === -1"
            v-model="operaInfo[item.prop]"
            :placeholder="item.placeholder"
          />
          <el-input
            v-if="
              item.prop.indexOf('target') !== -1 &&
              operaInfo.target !== undefined
            "
            v-model="operaInfo.target[item.what][item.prop]"
            :placeholder="item.placeholder"
          />
        </el-form-item>
      </template>
    </el-form>
    <div class="btn">
      <!-- 管理员不可编辑 -->
      <el-button type="primary" @click="changeInfo"
        >提交</el-button
      >
      <el-button @click="returnPage">返回</el-button>
    </div>
  </div>
</template>

<script>
// import Bus from '@/utils/bus.js'
import { AddQuality,
  AddLoadOven,
  AddEleCurve,
  AddBasic,
  AddDetail,
  UpdateQua,
  UpdateLoad,
  UpdateEle,
  UpdateBasic,
  UpdateDetail } from '@/api/graphiting.js'
export default {
  name: '',
  components: {},
  props: {},
  data () {
    return {
      operaForm: {},
      operaInfo: {},
      // 送电曲线表单的信息 情况比较特殊没找到解决办法 先这样赋值
      giveElectricInfo: {
        dc_voltage1: '',
        dc_voltage2: '',
        creator: '',
        initial_heat_value: '',
        actual_power: '',
        batch_number: '',
        describe: '',
        end_power: '',
        norms_type: '',
        planned_capacity: '',
        principal: '',
        shut_down_resistance: '',
        start_power: '',
        target: [
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          },
          {
            target_degrees: '',
            target_time: ''
          }
        ],
        ton_consumption: '',
        type: ''
      },
      // 送电记录表详细信息表单
      minuteInfo: {
        batch_number: '',
        norms_type: '',
        describe: '',
        stipulate_time: '',
        gear: '',
        first_voltage: [''],
        first_current: ['', '', ''],
        second_voltage: [''],
        second_current: [''],
        power: '',
        oven_resistance: '',
        drift: '',
        oil_oc: '',
        a_chest_oc: '',
        b_chest_oc: '',
        desc: ''
      },
      // 哪个表单
      kind: '',
      // 哪个操作
      handle: ''
    }
  },
  computed: {},
  watch: {},
  created () {
    // 接收路由传过来的info和kind
    // console.log(this.$route.query.handle)
    const { handle, kind } = this.$route.query
    // console.log('kind', kind)
    // console.log('handle', handle)
    this.kind = kind
    this.handle = handle
    if (handle === '编辑') {
      const info = this.$route.query.info
      // console.log('info', info)
      this.operaInfo = info
      // console.log('operaInfo', this.operaInfo.target)
    } else if (handle === '创建' && kind === 'giveElectric') {
      this.operaInfo = this.giveElectricInfo
    } else if (handle === '创建' && kind === 'minuteInfo') {
      this.operaInfo = this.minuteInfo
    } else if (handle === '查看') {
      const info = this.$route.query.info
      this.operaInfo = info
      // console.log(info)
    }
    this.getOperaForm()
  },
  mounted () { },
  methods: {
    // 修改或提交表单
    changeInfo () {
      // console.log('this.operaForm', this.operaForm)
      // console.log('this.operaInfo', this.operaInfo)
      // console.log('添加成功', this.operaInfo) JSON.stringify()
      switch (this.kind) {
        case 'qualityRequire':
          for (let i = 0; i < this.operaForm.length; i++) {
            if (this.operaForm[i].type === 'int') {
              this.operaInfo[this.operaForm[i].prop] = parseInt(this.operaInfo[this.operaForm[i].prop])
            } else if (this.operaForm[i].type === 'float') {
              this.operaInfo[this.operaForm[i].prop] = parseFloat(this.operaInfo[this.operaForm[i].prop])
            }
          }
          console.log('this.operaInfo', this.operaInfo)
          if (this.handle === '创建') {
            AddQuality(this.operaInfo).then(res => {
              console.log('创建', res)
              if (res.data.code === 1000) {
                this.$message.success('创建成功')
                // this.returnPage()
              }
            })
          } else if (this.handle === '编辑') {
            UpdateQua(this.operaInfo).then(res => {
              console.log('编辑', res)
              if (res.data.code === 1000) {
                this.$message.success('编辑成功')
                // this.returnPage()
              }
            })
          }
          break
        case 'inFurnace':
          for (let i = 0; i < this.operaForm.length; i++) {
            if (this.operaForm[i].type === 'int') {
              this.operaInfo[this.operaForm[i].prop] = parseInt(this.operaInfo[this.operaForm[i].prop])
            } else if (this.operaForm[i].type === 'float') {
              this.operaInfo[this.operaForm[i].prop] = parseFloat(this.operaInfo[this.operaForm[i].prop])
            }
          }
          if (this.handle === '创建') {
            AddLoadOven(this.operaInfo).then(res => {
              console.log('创建', res)
              if (res.data.code === 1000) {
                this.$message.success('创建成功')
                // this.returnPage()
              }
            })
          } else if (this.handle === '编辑') {
            UpdateLoad(this.operaInfo).then(res => {
              console.log('编辑', res)
              if (res.data.code === 1000) {
                this.$message.success('编辑成功')
                // this.returnPage()
              }
            })
          }
          break
        case 'giveElectric':
          for (let i = 0; i < this.operaForm.length; i++) {
            if (this.operaForm[i].type === 'int') {
              this.operaInfo[this.operaForm[i].prop] = parseInt(this.operaInfo[this.operaForm[i].prop])
            } else if (this.operaForm[i].type === 'float') {
              if (this.operaForm[i].what !== undefined) {
                // console.log(this.operaForm[i])
                // console.log(this.operaInfo.target[this.operaForm[i].what].target_degrees)
                this.operaInfo.target[this.operaForm[i].what].target_degrees = parseFloat(this.operaInfo.target[this.operaForm[i].what].target_degrees)
              } else {
                // console.log(this.operaInfo[this.operaForm[i].prop])
                this.operaInfo[this.operaForm[i].prop] = parseFloat(this.operaInfo[this.operaForm[i].prop])
              }
            }
          }
          if (this.handle === '创建') {
            AddEleCurve(this.operaInfo).then(res => {
              console.log('创建', res)
              if (res.data.code === 1000) {
                this.$message.success('创建成功')
                // this.returnPage()
              }
            })
          } else if (this.handle === '编辑') {
            UpdateEle(this.operaInfo).then(res => {
              console.log('编辑', res)
              if (res.data.code === 1000) {
                this.$message.success('编辑成功')
                // this.returnPage()
              }
            })
          }
          break
        case 'basicInfo':
          for (let i = 0; i < this.operaForm.length; i++) {
            if (this.operaForm[i].type === 'int') {
              this.operaInfo[this.operaForm[i].prop] = parseInt(this.operaInfo[this.operaForm[i].prop])
            } else if (this.operaForm[i].type === 'float') {
              this.operaInfo[this.operaForm[i].prop] = parseFloat(this.operaInfo[this.operaForm[i].prop])
            }
          }
          if (this.handle === '创建') {
            AddBasic(this.operaInfo).then(res => {
              console.log('创建', res)
              if (res.data.code === 1000) {
                this.$message.success('创建成功')
                // this.returnPage()
              }
            })
          } else if (this.handle === '编辑') {
            UpdateBasic(this.operaInfo).then(res => {
              console.log('编辑', res)
              if (res.data.code === 1000) {
                this.$message.success('编辑成功')
                // this.returnPage()
              }
            })
          }
          break
        case 'minuteInfo':
          for (let i = 0; i < this.operaForm.length; i++) {
            if (this.operaForm[i].type === 'int') {
              this.operaInfo[this.operaForm[i].prop] = parseInt(this.operaInfo[this.operaForm[i].prop])
            } else if (this.operaForm[i].type === 'float') {
              if (this.operaForm[i].what !== undefined) {
                // console.log(this.operaForm[i])
                this.operaInfo[this.operaForm[i].prop][this.operaForm[i].what] = parseFloat(this.operaInfo[this.operaForm[i].prop][this.operaForm[i].what])
                // console.log(this.operaInfo[this.operaForm[i].prop][this.operaForm[i].what])
              } else {
                this.operaInfo[this.operaForm[i].prop] = parseFloat(this.operaInfo[this.operaForm[i].prop])
              }
            }
          }
          if (this.handle === '创建') {
            AddDetail(this.operaInfo).then(res => {
              console.log('创建', res)
              if (res.data.code === 1000) {
                this.$message.success('创建成功')
                // this.returnPage()
              }
            })
          } else if (this.handle === '编辑') {
            UpdateDetail(this.operaInfo).then(res => {
              console.log('编辑', res)
              if (res.data.code === 1000) {
                this.$message.success('编辑成功')
                // this.returnPage()
              }
            })
          }
          break
        default:
          console.log('出错了')
          break
      }
      // sessionStorage.setItem('graActiveName', this.kind)
      // this.$router.go(-1)
      this.returnPage()
    },
    // 返回上一页
    returnPage () {
      // history.back(-1)
      // Bus.$emit('activeName', this.kind)
      // 保存当前标签页名称 返回之后还在当前标签页而不是在初始标签页
      sessionStorage.setItem('graActiveName', this.kind)
      this.$router.go(-1)
    },
    getOperaForm () {
      this.$axios.get(`http://127.0.0.1:7002/${this.kind}OperaForm`).then(res => {
        console.log('operaForm', res.data.tableData)
        this.operaForm = res.data.tableData
      })
    }
  }
}
</script>

<style scoped lang="">
.form {
  padding: 40px 0;
}
.btn {
  text-align: right;
}
.el-form-item {
  /* width: 100px; */
  display: inline-block !important;
}
</style>
